<button type="button" class="layui-btn layui-btn-danger" onclick="batchDeleteTeachers()">批量删除</button>
<button type="button" class="layui-btn" onclick="addTeacher()">新增教师信息</button>
<table id="teacher-info" lay-filter="teacher-info"></table>

<script>
	layui.use(["table", "layer", "form"], function (table, layer, form) {
		table.render({
			elem: '#teacher-info',
			height: 365,
			url: serverPath + "/teachers",
			headers: {
				"auth-token": getToken()
			},
			//res 即为原始返回的数据
			parseData: function (res) {
				return {
					"code": res.data.code,
					"count": res.data.count,
					"data": res.data.data
				};
			},
			page: true,
			page: {
				limit: 5,
				limits: [5, 10, 15, 20]
			},
			cols: [
				[{
					field: '',
					title: '',
					align: "center",
					type: "checkbox"
				},
				{
					field: 'teacherNo',
					title: '教师编号',
					align: "center"
				},
				{
					field: 'teacherName',
					title: '教师姓名',
					align: "center"
				},
				{
					field: '',
					title: '操作',
					align: "center",
					templet: function (row) {
						return `
                        <button type="button" class="layui-btn layui-btn-normal" lay-event="editTeacher">修改</button>
                        <button type="button" class="layui-btn layui-btn-danger" lay-event="deleteTeacher">删除</button>`;
					}
				}
				]
			],
			done: function (res, curr, count) {
				if (curr > 1 && null == res.data) {
					curr = curr - 1;
					table.reload('teacher-info', {
						//设定异步数据接口的额外参数，任意设
						where: {},
						page: {
							curr: curr
						}
					});
				}
			}
		});

		//新增教师
		window.addTeacher = function () {
			layer.prompt({
				title: "新增教师",
				value: ""
			}, function (value, index, elem) {
				layer.confirm("是否确认新增教师?", function (index) {
					//axios发送请求新增教师
					axios.post(serverPath + "/teachers", {
						username: value,
					}, {
						headers: {
							"auth-token": getToken()
						}
					})
						.then(function (response) {
							//成功后关闭上一个弹窗
							layer.close(index);
							//表格重新渲染
							table.reload("teacher-info");
							layer.confirm(response.data.data, function () {
								//关闭所有弹窗
								layer.closeAll();
							})
						})
						.catch(function (error) {
							layer.alert(error.response.data.error)
						});
				})
			});
		};

		//批量删除老师
		window.batchDeleteTeachers = function () {
			//获取表格的选择状态对象
			var checkStatus = table.checkStatus('teacher-info');
			//获取当前对象的数据
			var checkData = checkStatus.data;
			//将其收集为一个数组
			var teacherNos = $.map(checkData, function (obj) {
				return obj.teacherNo;
			});
			if (teacherNos.length < 2) {
				layer.alert("请至少选择两条数据");
				return;
			}
			deleteAny(teacherNos, (serverPath + "/teachers"), "teacher-info");
			table.reload("teacher-info");
		};

		//监听工具条 
		//注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
		//row 表示监听行事件
		//tool监听单元格事件
		table.on('tool(teacher-info)', function (obj) {
			//获得当前行数据
			var data = obj.data;
			//获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			var layEvent = obj.event;
			//获得当前行 tr 的 DOM 对象（如果有的话）
			var tr = obj.tr;
			//编辑老师
			if (layEvent === 'editTeacher') {
				var teacherName = data.teacherName;
				var teacherNo = data.teacherNo;
				//重新赋值，去零操作，即将0001 -- 1
				teacherNo = teacherNo.replace(/\b(0+)/gi, "");
				layer.prompt({
					title: "修改教师",
					value: teacherName
				}, function (value, index, elem) {
					if (value == teacherName) {
						layer.alert("请修改后再提交...")
					} else {
						axios.put(serverPath + "/teachers/" + teacherNo, {
							username: value
						}, {
							headers: {
								"auth-token": getToken()
							}
						}).then(function (response) {
							//成功后关闭上一个弹窗
							layer.close(index);
							layer.confirm(response.data.data, function () {
								//表格重新渲染
								table.reload("teacher-info");
								//关闭所有弹窗
								layer.closeAll();
							})
						}).catch(function (error) {
							layer.alert(error.response.data.error);
						});
					}
				});
			}
			//删除单个老师
			if (layEvent === 'deleteTeacher') {
				layer.confirm('是否要删除吗?', function (index) {
					//删除对应行（tr）的DOM结构，并更新缓存
					obj.del();
					layer.close(index);
					//向服务端发送删除指令
					//deleteAny该方法在common.js中
					deleteAny(teacherNo, (serverPath + "/teachers"), "teacher-info");
				});
			}
		});
	});
</script>